<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <!-- 正常的 -->
  <!-- <style>.box {width:300px;height:300px;background-color: black;margin:10px auto 0;border-radius: 10pxpx}</style> -->
  <!-- xy轴 -->
   <!-- <style>.box {width:300px;height:300px;background-color: black;margin:10px auto 0;border-radius: 10px/20px}</style> -->
  <!-- abcd四个角分别对应的圆角程度 -->
   <!-- <style>.box {width:300px;height:300px;background-color: black;margin:10px auto 0;border-radius: 10px 20px 50px 100px}</style> -->
   <!-- 百分比的写法 50% 最大 变成了一个圆形-->
   <style>.box {width:300px;height:300px;background-color: black;margin:10px auto 0;border-radius: 50%}</style>
  <body>
    <div class="box"></div>
  </body>
</html>
